/**
 *该CSS文件用于定义全局公用样式
 */

/*字体大小*/
:root {
  --text-12: 12px;
  --text-14: 14px;
  --text-16: 16px;
  --text-18: 18px;
  --text-20: 20px;
  --text-22: 22px;
  --text-24: 24px;
  --text-26: 26px;
  --text-28: 28px;
  --text-32: 32px;
  --text-36: 36px;
}

.text-12 {
  font-size: var(--text-12);
}

.text-14 {
  font-size: var(--text-14);
}

.text-16 {
  font-size: var(--text-16);
}

.text-18 {
  font-size: var(--text-18);
}

.text-20 {
  font-size: var(--text-20);
}

.text-22 {
  font-size: var(--text-22);
}

.text-24 {
  font-size: var(--text-24);
}

.text-26 {
  font-size: var(--text-26);
}

.text-28 {
  font-size: var(--text-28);
}

.text-32 {
  font-size: var(--text-32);
}

.text-36 {
  font-size: var(--text-36);
}

/*字体颜色*/
.text-color1 {
  color: var(--text-color1)
}

.text-color2 {
  color: var(--text-color2);
}

.text-color3 {
  color: var(--text-color3);
}

.text-color4 {
  color: var(--text-color4);
}

.text-color5 {
  color: var(--text-color5);
}

.text-color6 {
  color: var(--text-color6);
}

.text-color7 {
  color: var(--text-color7);
}

.text-color8 {
  color: var(--text-color8);
}

.text-color9 {
  color: var(--text-color9);
}

.text-color10 {
  color: var(--text-color10);
}

.text-color11 {
  color: var(--text-color11);
}

.text-color12 {
  color: var(--text-color12);
}

.text-color13 {
  color: var(--text-color13);
}

/*背景颜色*/
.bg-color1 {
  background-color: var(--bg-color1);
}

.bg-color2 {
  background-color: var(--bg-color2);
}

.bg-color3 {
  background-color: var(--bg-color3);
}

.bg-color4 {
  background-color: var(--bg-color4);
}

.bg-color5 {
  background-color: var(--bg-color5);
}

.bg-color6 {
  background-color: var(--bg-color6);
}

.bg-color7 {
  background-color: var(--bg-color7);
}

.bg-color8 {
  background-color: var(--bg-color8);
}

.bg-color9 {
  background-color: var(--bg-color9);
}

.bg-color10 {
  background-color: var(--bg-color10);
}

.bg-color12 {
  background-color: var(--bg-color12);
}

.bg-color13 {
  background-color: var(--bg-color13);
}

.bg-color14 {
  background-color: var(--bg-color14);
}

.bg-color15 {
  background-color: var(--bg-color15);
}

.bg-color16 {
  background-color: var(--bg-color16);
}

.bg-color17 {
  background-color: var(--bg-color17);
}

.bg-color18 {
  background-color: var(--bg-color18);
}

.bg-color20 {
  background-color: var(--bg-color20);
}

.bg-color21 {
  background-color: var(--bg-color21);
}

.bg-color22 {
  background-color: var(--bg-color22);
}

.bg-color23 {
  background-color: var(--bg-color23);
}

.bg-color24 {
  background-color: var(--bg-color24);
}

.bg-color25 {
  background-color: var(--bg-color25);
}

.bg-color26 {
  background-color: var(--bg-color26);
}

.bg-color27 {
  background-color: var(--bg-color27);
}

/*边框颜色*/
.border-color1 {
  border-color: var(--border-color1);
}

.border-color2 {
  border-color: var(--border-color2);
}

.border-color3 {
  border-color: var(--border-color3);
}

.border-color4 {
  border-color: var(--border-color4);
}

.border-color5 {
  border-color: var(--border-color5);
}

.border-color6 {
  border-color: var(--border-color6);
}

.border-color7 {
  border-color: var(--border-color7);
}

.border-color8 {
  border-color: var(--border-color8);
}

.border-color9 {
  border-color: var(--border-color9);
}

.border-color10 {
  border-color: var(--border-color10);
}

.border {
  border: 1px solid var(--border-color3);
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.border-top {
  border-top: 1px solid var(--border-color3);
}

.border-left {
  border-left: 1px solid var(--border-color3);
}

.border-right {
  border-right: 1px solid var(--border-color3);
}

.border-bottom {
  border-bottom: 1px solid var(--border-color3);
}

/*透明度*/
:root {
  --opacity-0: 0;
  --opacity-10: 0.1;
  --opacity-20: 0.2;
  --opacity-30: 0.3;
  --opacity-40: 0.4;
  --opacity-50: 0.5;
  --opacity-60: 0.6;
  --opacity-70: 0.7;
  --opacity-80: 0.8;
  --opacity-90: 0.9;
  --opacity-100: 1;
}

.opacity-0 {
  opacity: var(--opacity-0);
}

.opacity-10 {
  opacity: var(--opacity-10);
}

.opacity-20 {
  opacity: var(--opacity-20);
}

.opacity-30 {
  opacity: var(--opacity-30);
}

.opacity-40 {
  opacity: var(--opacity-40);
}

.opacity-50 {
  opacity: var(--opacity-50);
}

.opacity-60 {
  opacity: var(--opacity-60);
}

.opacity-70 {
  opacity: var(--opacity-70);
}

.opacity-80 {
  opacity: var(--opacity-80);
}

.opacity-90 {
  opacity: var(--opacity-90);
}

.opacity-100 {
  opacity: var(--opacity-100);
}

/*textarea*/
textarea {
  background-color: var(--bg-color10);
  color: var(--text-color1);
  border: 1px solid var(--border-color3);
}

textarea:hover, textarea:focus {
  border: 1px solid var(--border-color5);
}

/*文本*/
.text-ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/*超链接*/
a {
  color: var(--text-color6);
}

a:hover {
  color: var(--text-color9);
}

/*el-upload*/
.el-upload .upload-demo-info {
  position: relative;
}

.el-upload .upload-demo-info::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}